﻿<!DOCTYPE html>
<!--[if IE 7 ]><html class="ie ie7 lte9 lte8 lte7" lang="en-US"><![endif]-->
<!--[if IE 8]><html class="ie ie8 lte9 lte8" lang="en-US">	<![endif]-->
<!--[if IE 9]><html class="ie ie9 lte9" lang="en-US"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html class="noIE" lang="en-US">
<!--<![endif]-->
<head>
    <meta charset="UTF-8" />
    <title>ShopFast - Modern Ecommerce HTML Template</title>
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <!-- Favorite Icons
        ============================================================================== -->
    <link rel="icon" href="images/favicon/favicon.html" type="image/x-icon" />
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/favicon/apple-touch-icon-144x144-precomposed.html">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/favicon/apple-touch-icon-72x72-precomposed.html">
    <link rel="apple-touch-icon-precomposed" href="images/favicon/apple-touch-%20icon-precomposed.html">

    <!-- Web Fonts
        ============================================================================== -->
    <!-- If you want to use google font remove this comment block and local font stylesheet
        <link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
        -->
    <link rel="stylesheet" href="fonts/open-sans/stylesheet.css" type="text/css">
    <link rel="stylesheet" href="fonts/icomoon/style.css" type="text/css" media="screen" />

    <!-- CSS styles
        ============================================================================== -->
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="css/responsive.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="css/animate.css" type="text/css" media="screen" />


    <!-- Javascripts
        ============================================================================== -->
    <!--[if IE 8]><script src="js/respond.min.js"></script><![endif]-->
    <<!--script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>-->
    <script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>');</script>
    <script src="js/modernizr.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/package.min.js"></script>
    <script src="js/jquery.tweet.js"></script>
    <script src="js/scripts.js"></script>

</head>
<body>

    <!-- PAGE WRAPPER
        ============================================================================== -->
    <div id="page-wrapper">

        <!-- SITE HEADER
            =========================================================================== -->
        <div id="site-header">
            <!-- top header bar -->
            <div id="site-header-bar">
                <div class="container">

                    <div class="row">
                        <!-- top header links -->
                        <div class="col-xs-12 col-sm-6 top-links center-sm">
                            <ul class="menu">
                                <li><a href="index.html">Tài khoản</a></li>
                                <li><a href="cart.html">Yêu thích</a></li>
                                <li><a href="checkout.html">Thanh toán</a></li>
                                <li><a href="#">Đăng nhập</a></li>
                                <li><a href="#">Đăng ký</a></li>
                            </ul>
                        </div>
                        <!-- /top header links -->
                        <!--
                            | -------------------------------------------------------------------------------------------
                            |	SOCIAL ICONS
                            | -------------------------------------------------------------------------------------------
                            |	Two hover effect avaiable for social icons
                            |	by default hover effect is template accent color
                            |	but you can add "multicolor" class to div.header-social-icons to have multicolor hover effect
                            |	i.e. Your container must look like this:
                            |	<div class="col-xs-12 col-sm-6 header-social-icons multicolor center-sm">
                            | -------------------------------------------------------------------------------------------
                            -->
                        <div class="col-xs-12 col-sm-6 header-social-icons center-sm">
                            <ul>
                                <li>
                                    <a href="#" class="facebook">
                                        <br />
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <!-- /social icons -->
                    </div>

                </div>
            </div>
            <!-- /top header bar -->
            <!-- main header -->
            <div id="header-main">
                <div class="container">

                    <div class="row">

                        <!-- logo -->
                        <div class="col-xs-6 col-sm-6 logo-container">
                            <strong class="logo animated fadeInRight">
                                <a href="index.html">
                                    <img src="http://placehold.it/50x50" alt="" title="" />
                                </a>
                            </strong>
                        </div>
                        <!-- /logo -->
                        <!-- shopping cart -->
                        <div class="col-xs-6 col-sm-6 cart-container">
                            <div class="header-cart animated fadeInLeft">

                                <div class="inner">
                                    <div class="relative">
                                        <a href="#" class="btn btn-iconed">
                                            <i class="icon-shopcart"></i>
                                            <span>2 Item(s) - $220.00</span>
                                        </a>

                                        <!-- CART ITEMS -->
                                        <div class="cart-items">
                                            <div class="header">Hiển thị 2 của 2 sản phẩm đã thêm</div>
                                            <ul class="items clearfix">
                                                <li>
                                                    <div class="item-thumbnail">
                                                        <a href="#" title="">
                                                            <img src="img/offer/Nanette-Lepore-Go-Crazy-Mixed-Knit-Dress.jpg" alt="" />
                                                        </a>
                                                    </div>
                                                    <a href="#" class="item-name">Wooman Dresses</a>
                                                    <span class="item-price">$110.00</span>
                                                    <div class="clearfix"></div>
                                                </li>
                                                <li>
                                                    <div class="item-thumbnail">
                                                        <a href="#" title="">
                                                            <img src="img/offer/2013-New-Women-s-O-neck-Short-Sleeve-Slim-Dot-Printed-Pure-Silk-Satin-Dress-IM-03151261-1.jpg" alt="" />
                                                        </a>
                                                    </div>
                                                    <a href="#" class="item-name">Wooman Dresses</a>
                                                    <span class="item-price">$110.00</span>
                                                    <div class="clearfix"></div>
                                                </li>
                                            </ul>
                                            <div class="footer"><a href="cart.html">Xem tất cả</a></div>
                                        </div>
                                        <!-- /CART ITEMS -->
                                    </div>
                                </div>

                            </div>
                        </div>
                        <!-- /shopping cart -->

                    </div>

                </div>
            </div>
            <!-- /main header -->
            <!-- Navigation menu -->
            <div id="site-menu">
                <div class="container">

                    <div class="inner">

                        <!-- main menu -->
                        <ul class="main-menu menu visible-lg">
                            <li class="active">
                                <a href="index.html"><i class="icon-home"></i></a>
                            </li>
                            <li>
                                <a href="javascript:void(0);">Pages</a>

                                <ul>
                                    <li>
                                        <a href="product.html">Products</a>

                                        <ul>
                                            <li><a href="product2.html?mode=grid">Grid layout</a></li>
                                            <li><a href="product1.html?mode=list">List layout</a></li>
                                            <li><a href="single.html">Product details</a></li>
                                        </ul>
                                    </li>
                                    <li><a href="cart.html">Shopping cart</a></li>
                                    <li><a href="checkout.html">Checkout</a></li>
                                    <li><a href="contact.html">Contact us</a></li>
                                    <li><a href="index2.html?slider=nivo">Homepage - Nivoslider</a></li>
                                    <li><a href="index1.html?slider=flex">Homepage - Flexslider</a></li>
                                </ul>

                            </li>
                            <li>
                                <a href="product.html">Đồ nam</a>

                                <ul>
                                    <li><a href="product1.html?mode=list">Áo phông</a></li>
                                    <li><a href="product2.html?mode=grid">Quần jean</a></li>
                                </ul>

                            </li>
                            <li><a href="contact.html">Liên hệ</a></li>
                        </ul>
                        <!-- /main menu -->
                        <!-- mobile main menu -->
                        <div class="mobile-menu hidden-lg">

                            <div id="dl-menu" class="dl-menuwrapper">
                                <button class="dl-trigger"><i class="icon-reorder"></i></button>
                                <ul class="dl-menu">
                                    <li class="active">
                                        <a href="javsacript:void(0);"><i class="icon-home"></i></a>

                                        <ul class="dl-submenu">
                                            <li><a href="index2.html?slider=nivo">Homepage - Nivoslider</a></li>
                                            <li><a href="index1.html?slider=flex">Homepage - Flexslider</a></li>
                                        </ul>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0);">Pages</a>

                                        <ul class="dl-submenu">
                                            <li>
                                                <a href="javsacript:void(0);">Products</a>

                                                <ul class="dl-submenu">
                                                    <li><a href="product2.html?mode=grid">Grid layout</a></li>
                                                    <li><a href="product1.html?mode=list">List layout</a></li>
                                                    <li><a href="single.html">Product details</a></li>
                                                </ul>
                                            </li>
                                            <li><a href="cart.html">Shopping cart</a></li>
                                            <li><a href="checkout.html">Checkout</a></li>
                                            <li><a href="contact.html">Contact us</a></li>
                                            <li><a href="index2.html?slider=nivo">Homepage - Nivoslider</a></li>
                                            <li><a href="index1.html?slider=flex">Homepage - Flexslider</a></li>
                                        </ul>

                                    </li>
                                    <li>
                                        <a href="javsacript:void(0);">men</a>

                                        <ul class="dl-submenu">
                                            <li><a href="product1.html?mode=list">Belt</a></li>
                                            <li><a href="product2.html?mode=grid">Sweatshirts</a></li>
                                        </ul>

                                    </li>
                                    <li><a href="product.html">women</a></li>
                                    <li><a href="product.html">fashion</a></li>
                                    <li><a href="product.html">brands</a></li>
                                    <li><a href="product.html">gift</a></li>
                                    <li><a href="contact.html">contact us</a></li>
                                </ul>
                            </div>
                            <!-- /dl-menuwrapper -->

                        </div>
                        <!-- /mobile main menu -->
                        <!-- search box -->
                        <div class="search-box">
                            <form onsubmit="event.preventDefault();">
                                <input type="text" name="query" class="query" placeholder="Tìm kiếm" />
                                <button class="btn-search"><i class="icon-search"></i></button>
                            </form>
                        </div>
                        <!-- /search box -->

                    </div>

                </div>
            </div>
            <!-- /Navigation menu -->

        </div>
        <!-- /SITE HEADER -->
        <!-- SITE CONTENT
            =========================================================================== -->
        <div id="site-content">

            <!-- TOP SLIDER -->
            <!-- INCLUDE ESSENTIAL SLIDESHOW FILES -->
            <link rel="stylesheet" href="css/flexslider/flexslider.css" type="text/css" media="screen" />
            <link rel="stylesheet" href="css/flexslider/default.css" type="text/css" media="screen" />
            <script src="js/jquery.flexslider.min.js"></script>

            <!-- FLEXSLIDER CONTAINER -->
            <div id="top-slider" class="flexslider-container">
                <div class="flexslider">

                    <!-- BEGIN SLIDES -->
                    <ul class="slides">
                        <li>
                            <img src="img/slider/1.jpg" alt="" />

                            <!-- SLIDE CAPTION -->
                            <div class="flex-caption slider-caption">
                                <div class="container">

                                    <div class="row">
                                        <div class="col-xs-12 col-sm-8 col-lg-6 caption-body hidden-xs">
                                            <h1 class="title animated" data-animation="fadeInDownBig">Giảm giá đặc biệt chào đông 2013</h1>
                                            <p class="subtitle col-sm-9 animated" data-animation="fadeInUp">Khách hàng được giảm giá 20% khi mua 2 sản phẩm trở lên tại SHOP [...]</p>
                                            <div class="clearfix"></div>
                                            <a href="#" class="btn btn-primary btn-iconed animated" data-animation="fadeIn">
                                                <i class="icon-shopcart"></i>
                                                <span>Mua ngay</span>
                                            </a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                            <!-- /SLIDE CAPTION -->

                        </li>
                        <li>
                            <img src="img/slider/2.jpg" alt="" />

                            <!-- SLIDE CAPTION -->
                            <div class="flex-caption slider-caption">
                                <div class="container">

                                    <div class="row">
                                        <div class="col-xs-12 col-sm-4 col-lg-6 caption-body">
                                            <h1 class="title animated" data-animation="fadeInRightBig">
                                                Save Up<br />
                                                to <span class="accent-color big-number">30%</span>
                                            </h1>
                                        </div>
                                        <div class="col-xs-12 col-sm-8 col-lg-6 hidden-xs">

                                            <!-- popular products -->
                                            <div class="carousel-container carousel-box animated" data-animation="fadeInRight">

                                                <!-- box header -->
                                                <div class="box-header">
                                                    <h4 class="heading">Popular Products</h4>
                                                    <!-- carousel control nav direction -->
                                                    <div class="control-direction">
                                                        <ul class="direction-nav carousel-direction">
                                                            <li>
                                                                <a id="foo" class="carousel-prev btn" href="#">
                                                                    <span class="icon-arrow_left"></span>
                                                                </a>
                                                            </li>
                                                            <li>
                                                                <a id="bar" class="carousel-next btn" href="#">
                                                                    <span class="icon-arrow_right"></span>
                                                                </a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                    <!-- /carousel control nav direction -->
                                                </div>
                                                <!-- /box header -->
                                                <!-- box content -->
                                                <div class="box-content">
                                                    <!-- carousel wrapper -->
                                                    <div class="carousel-wrapper row" data-minitems="1" data-maxitems="2" data-loop="true" data-autoplay="false" data-slideshow-speed="3000" data-speed="300">
                                                        <ul class="products-container product-grid carousel-list">

                                                            <li class="offer">
                                                                <div class="product">
                                                                    <a href="#" class="product-link clearfix">
                                                                        <div class="product-thumbnail">
                                                                            <img src="img/offer/Nanette-Lepore-La-Boqueria-Embroidered-Top-Flamenco-Floral-Print-Skirt.jpg" alt="" />
                                                                            <div class="caption bottom-left">$110</div>
                                                                        </div>
                                                                    </a>
                                                                    <div class="product-info clearfix">
                                                                        <h4 class="title">
                                                                            <a href="#">Woman Summer Dresses</a>
                                                                        </h4>
                                                                    </div>
                                                                    <div class="product-info hover clearfix">
                                                                        <h4 class="title">
                                                                            <a href="#">Woman Summer Dresses</a>
                                                                        </h4>
                                                                        <div class="details">
                                                                            <p>
                                                                                Model: <a href="#">Saverina Dark</a>
                                                                            </p>
                                                                            <p class="by">
                                                                                by: <a href="#">shopfast</a>
                                                                            </p>
                                                                        </div>
                                                                        <a href="#" class="add-to-cart">
                                                                            <span class="icon-shopcart"></span>
                                                                        </a>
                                                                    </div>
                                                                </div>
                                                            </li>

                                                            <li class="offer">
                                                                <div class="product">
                                                                    <a href="#" class="product-link clearfix">
                                                                        <div class="product-thumbnail">
                                                                            <img src="img/offer/Ali-Ro-Cap-Sleeve-Multi-Print-Silk-Dress.jpg" alt="" />
                                                                            <div class="caption top-right">- 15%</div>
                                                                        </div>
                                                                    </a>
                                                                    <div class="product-info clearfix">
                                                                        <h4 class="title">Woman Summer Dresses</h4>
                                                                    </div>
                                                                    <div class="product-info hover clearfix">
                                                                        <h4 class="title">
                                                                            <a href="#">Woman Summer Dresses</a>
                                                                        </h4>
                                                                        <div class="details">
                                                                            <p>
                                                                                Model: <a href="#">Saverina Dark</a>
                                                                            </p>
                                                                            <p class="by">
                                                                                by: <a href="#">shopfast</a>
                                                                            </p>
                                                                        </div>
                                                                        <a href="#" class="add-to-cart">
                                                                            <span class="icon-shopcart"></span>
                                                                        </a>
                                                                    </div>
                                                                </div>
                                                            </li>

                                                            <li class="offer">
                                                                <div class="product">
                                                                    <a href="#" class="product-link clearfix">
                                                                        <div class="product-thumbnail">
                                                                            <img src="img/offer/RED-Valentino-Ruffed-Peplum-Cardigan-Floral-Print-Fit-and-Flare-Dress.jpg" alt="" />
                                                                            <div class="caption top-right">- 15%</div>
                                                                        </div>
                                                                    </a>
                                                                    <div class="product-info clearfix">
                                                                        <h4 class="title">Woman Summer Dresses</h4>
                                                                    </div>
                                                                    <div class="product-info hover clearfix">
                                                                        <h4 class="title">
                                                                            <a href="#">Woman Summer Dresses</a>
                                                                        </h4>
                                                                        <div class="details">
                                                                            <p>
                                                                                Model: <a href="#">Saverina Dark</a>
                                                                            </p>
                                                                            <p class="by">
                                                                                by: <a href="#">shopfast</a>
                                                                            </p>
                                                                        </div>
                                                                        <a href="#" class="add-to-cart">
                                                                            <span class="icon-shopcart"></span>
                                                                        </a>
                                                                    </div>
                                                                </div>
                                                            </li>

                                                            <li class="offer">
                                                                <div class="product">
                                                                    <a href="#" class="product-link clearfix">
                                                                        <div class="product-thumbnail">
                                                                            <img src="img/offer/2013-.jpg" alt="" />
                                                                            <div class="caption bottom-left">$110</div>
                                                                        </div>
                                                                    </a>
                                                                    <div class="product-info clearfix">
                                                                        <h4 class="title">Woman Summer Dresses</h4>
                                                                    </div>
                                                                    <div class="product-info hover clearfix">
                                                                        <h4 class="title">
                                                                            <a href="#">Woman Summer Dresses</a>
                                                                        </h4>
                                                                        <div class="details">
                                                                            <p>
                                                                                Model: <a href="#">Saverina Dark</a>
                                                                            </p>
                                                                            <p class="by">
                                                                                by: <a href="#">shopfast</a>
                                                                            </p>
                                                                        </div>
                                                                        <a href="#" class="add-to-cart">
                                                                            <span class="icon-shopcart"></span>
                                                                        </a>
                                                                    </div>
                                                                </div>
                                                            </li>

                                                        </ul>
                                                    </div>
                                                </div>
                                                <!-- /box content -->

                                            </div>
                                            <!-- /popular products -->

                                        </div>
                                    </div>

                                </div>
                            </div>
                            <!-- SLIDE CAPTION -->

                        </li>
                    </ul>
                    <!-- #END SLIDES -->

                </div>
            </div>
            <!-- /FLEXSLIDER CONTAINER -->
            <!-- INITIALIZE SLIDESHOW -->
            <script>
                jQuery(function ($) {
                    var $slider = $('#top-slider > .flexslider');
                    $slider.imagesLoaded(function () {
                        $slider.flexslider({
                            animation: 'slide',
                            easing: 'easeInBack',
                            useCSS: false,
                            animationSpeed: 1000,
                            slideshow: false,
                            smoothHeight: true,
                            start: function (slider) {
                                // wrap control nav inside container
                                var $controlNav = $slider.find('.flex-control-nav');
                                $controlNav.wrap('<div class="flex-pagination-container" />').wrap('<div class="container" />').wrap('<div class="col-xs-12 col-sm-12" />');
                                $controlNav.fadeIn();

                                center_caption(slider);
                            },
                            before: function (slider) {
                                // initial caption animation for next show
                                $slider.find('.slides li .animation-done').each(function () {
                                    $(this).removeClass('animation-done');
                                    var animation = $(this).attr('data-animation');
                                    $(this).removeClass(animation);
                                });

                                center_caption(slider)
                                $(window).trigger('resize');
                            },
                            after: function () {
                                // run caption animation
                                $slider.find('.flex-active-slide .animated').each(function () {
                                    var animation = $(this).attr('data-animation');
                                    $(this).addClass('animation-done').addClass(animation);
                                });
                                $(window).trigger('resize');
                            }
                        });
                    });

                    // vertical align center caption
                    function center_caption(slider) {
                        $slider.find('li:eq(' + (slider.animatingTo + 1) + ') .caption-body').each(function () {
                            var $caption = $(this),
                                captionH = $caption.outerHeight(),
                                // sliderH = $slider.height(),
                                // let's hardcode it
                                sliderH = 480,
                                top = (sliderH - captionH) / 2;

                            $caption.css('top', top + 'px');
                        });
                    }

                    $(window).on('throttledresize', function () {
                        $slider.find('.flex-active-slide .caption-body').each(function () {
                            var $caption = $(this),
                                captionH = $caption.outerHeight(),
                                sliderH = $slider.height(),
                                top = (sliderH - captionH) / 2;

                            $caption.css('top', top + 'px');
                        });
                    });
                });
            </script>
            <!-- /TOP SLIDER -->
            <!-- san pham moi -->
            <div class="section with-carousel">
                <div class="container">

                    <div class="row carousel-container offer">
                        <div class="col-xs-12 col-sm-12">

                            <h4 class="section-title">Hàng mới về</h4>
                            <div class="section-body">

                                <!-- carousel control nav direction -->
                                <div class="control-direction">
                                    <ul class="direction-nav carousel-direction">
                                        <li>
                                            <a class="carousel-prev btn" href="#">
                                                <span class="icon-arrow_left"></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a class="carousel-next btn" href="#">
                                                <span class="icon-arrow_right"></span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <!-- /carousel control nav direction -->
                                <!-- carousel wrapper -->
                                <div class="carousel-wrapper row" data-minitems="1" data-maxitems="4" data-loop="true" data-autoplay="true" data-slideshow-speed="3000" data-speed="300">
                                    <ul class="products-container product-grid carousel-list portrait animated" data-animation="fadeInUp">

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Robert-Rodriguez-Lace-Applique-Pleated-Strapless-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-La-Boqueria-Embroidered-Top-Flamenco-Floral-Print-Skirt.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/2013-Women-s-O-neck-Retro-Sequins-Floral-Printed-Pure-Silk-Satin-Dress-IM-02311378-1.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-Go-Crazy-Mixed-Knit-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-Amorcito-One-Shoulder-Knit-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-Barcelona-Crochet-Blazer-Sunbathe-Printed-Sleeveless-Top.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/2013-New-Women-s-O-neck-Short-Sleeve-Slim-Dot-Printed-Pure-Silk-Satin-Dress-IM-03151261-1.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Alexander-McQueen-Cap-Sleeve-Puckered-Jacquard-Sheath-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                    </ul>
                                </div>
                                <!-- /carousel wrapper -->

                            </div>

                        </div>
                    </div>

                </div>
            </div>
            <!-- /offer products -->
            <!-- offer products -->
            <div class="section with-carousel">
                <div class="container">

                    <div class="row carousel-container offer">
                        <div class="col-xs-12 col-sm-12">

                            <h4 class="section-title">Hàng bán chạy</h4>
                            <div class="section-body">

                                <!-- carousel control nav direction -->
                                <div class="control-direction">
                                    <ul class="direction-nav carousel-direction">
                                        <li>
                                            <a class="carousel-prev btn" href="#">
                                                <span class="icon-arrow_left"></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a class="carousel-next btn" href="#">
                                                <span class="icon-arrow_right"></span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <!-- /carousel control nav direction -->
                                <!-- carousel wrapper -->
                                <div class="carousel-wrapper row" data-minitems="1" data-maxitems="4" data-loop="true" data-autoplay="false" data-slideshow-speed="3000" data-speed="300">
                                    <ul class="products-container product-grid carousel-list portrait animated" data-animation="fadeInUp">

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Robert-Rodriguez-Lace-Applique-Pleated-Strapless-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-La-Boqueria-Embroidered-Top-Flamenco-Floral-Print-Skirt.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/2013-Women-s-O-neck-Retro-Sequins-Floral-Printed-Pure-Silk-Satin-Dress-IM-02311378-1.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-Go-Crazy-Mixed-Knit-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-Amorcito-One-Shoulder-Knit-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Nanette-Lepore-Barcelona-Crochet-Blazer-Sunbathe-Printed-Sleeveless-Top.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="ribbon special"></div>
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/2013-New-Women-s-O-neck-Short-Sleeve-Slim-Dot-Printed-Pure-Silk-Satin-Dress-IM-03151261-1.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                        <li>
                                            <div class="product">
                                                <a href="#" class="product-link clearfix">
                                                    <div class="product-thumbnail">
                                                        <img src="img/offer/Alexander-McQueen-Cap-Sleeve-Puckered-Jacquard-Sheath-Dress.jpg" alt="" />
                                                        <div class="caption bottom-left">$110</div>
                                                        <div class="caption top-right">- 20%</div>
                                                    </div>
                                                </a>
                                                <div class="product-info clearfix">
                                                    <h4 class="title">
                                                        <a href="#">Woman Summer Dresses</a>
                                                    </h4>
                                                    <div class="details">
                                                        <p>
                                                            Model: <a href="#">Saverina Dark</a>
                                                        </p>
                                                        <p class="by">
                                                            by: <a href="#">shopfast</a>
                                                        </p>
                                                    </div>
                                                    <a href="#" class="add-to-cart">
                                                        <span class="icon-shopcart"></span>
                                                    </a>
                                                </div>
                                            </div>
                                        </li>

                                    </ul>
                                </div>
                                <!-- /carousel wrapper -->

                            </div>

                        </div>
                    </div>

                </div>
            </div>
            <!-- /offer products -->

        </div>
        <!-- /SITE CONTENT -->
        <!-- SITE FOOTER
            =========================================================================== -->
        <div id="site-footer">

            <div class="footer-widgets alt">
                <div class="container">

                    <div class="row">

                        <!-- WIDGET: ABOUT US -->
                        <div class="col-xs-12 col-sm-6 col-lg-3">
                            <div class="widget widget-text">
                                <h4 class="widget-title">Phương châm</h4>
                                <div class="widget-body">
                                    <p>
                                        Vui lòng khách đến, vừa lòng khách đi [...]
                                    </p>
                                </div>
                            </div>
                            <div class="space40 hidden-lg"></div>
                        </div>
                        <!-- /WIDGET: ABOUT US -->
                        <!-- WIDGET: CONTACT US -->
                        <div class="col-xs-12 col-sm-6 col-lg-3">
                            <div class="widget widget-contact">
                                <h4 class="widget-title">Liên hệ</h4>
                                <div class="widget-body iconlist">

                                    <div class="media">
                                        <div class="pull-left">
                                            <i class="icon-location"></i>
                                        </div>
                                        <div class="media-body">
                                            <p>
                                                Số nhà 15, Đường Chu Văn An,
                                                <br />
                                                TP Thái nguyên.
                                            </p>
                                        </div>
                                    </div>
                                    <div class="media">
                                        <div class="pull-left">
                                            <i class="icon-phone"></i>
                                        </div>
                                        <div class="media-body">
                                            <p>
                                                0968868xxx<br />
                                            </p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                            <div class="space40 hidden-lg"></div>
                        </div>
                        <!-- /WIDGET: CONTACT US -->

                        <div class="col-xs-12 col-sm-12 hidden-lg"></div>

                        <!-- WIDGET: TWITTER FEED -->
                        <div class="col-xs-12 col-sm-6 col-lg-3">
                            <div class="widget widget-twitter">
                                <h4 class="widget-title">Latest Tweets</h4>
                                <div class="widget-body twitterfeed iconlist">
                                    <div class="media">
                                        <div class="pull-left">
                                            <i class="icon-tweet"></i>
                                        </div>
                                        <div class="media-body">
                                            <p>Briza 1.5 has been quickly releas edto fix some bugs from the pre More on <a href="http://t.co/MqacjST" target="_blank">http://t.co/MqacjST</a></p>
                                            <p><i>12 minutes ago</i></p>
                                        </div>
                                    </div>
                                    <div class="media">
                                        <div class="pull-left">
                                            <i class="icon-tweet"></i>
                                        </div>
                                        <div class="media-body">
                                            <p>@shop fast template please, use the <a href="http://t.co/zRmkywea" target="_blank">http://t.co/zRmkywea</a> to ask support questions [...]</p>
                                            <p><i>25 minutes ago</i></p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="space40 hidden-lg"></div>
                        </div>
                        <!-- /WIDGET: TWITTER FEED -->
                        <!-- WIDGET: FACEBOOK FEED -->
                        <div class="col-xs-12 col-sm-6 col-lg-3">
                            <div class="widget widget-facebook">
                                <h4 class="widget-title">Facebook Widget</h4>
                                <div class="widget-body">

                                    <!-- facebook social plugin SDK -->
                                    <div id="fb-root"></div>
                                    <script>
                                        (function (d, s, id) {
                                            var js, fjs = d.getElementsByTagName(s)[0];
                                            if (d.getElementById(id)) return;
                                            js = d.createElement(s); js.id = id;
                                            js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&status=0";
                                            fjs.parentNode.insertBefore(js, fjs);
                                        }(document, 'script', 'facebook-jssdk'));
                                    </script>
                                    <!-- /facebook social plugin SDK -->
                                    <div class="fb-like-box" data-href="https://www.facebook.com/envato" data-width="270" data-height="200" data-show-faces="true" data-header="true" data-stream="false" data-show-border="false"></div>

                                </div>
                            </div>
                            <div class="space40 hidden-lg"></div>
                        </div>
                        <!-- /WIDGET: FACEBOOK FEED -->

                    </div>

                </div>
            </div>

            <div class="sub-footer">
                <div class="container">

                    <div class="row">

                        <div class="col-xs-12 col-sm-6 copyright center-sm">
                            Copyright © 2013 ShopFast   |   All Rights Reserved.
                        </div>

                        <div class="col-xs-12 space10 visible-xs"></div>

                    </div>

                </div>
            </div>

        </div>
        <!-- /SITE FOOTER -->

    </div>
    <!-- /PAGE WRAPPER -->
    <script src="js/jquery.carouFredSel.min.js"></script>
</body>
</html>
